<script setup lang="ts">
  import { queryStateByCode } from '@/api/dict';
  import { useSelectOption } from '@/hooks/arco/useSelectOption';
  import { computed } from 'vue';

  const props = defineProps({
    type: {
      required: true,
      type: String,
    },
  });

  const modelVal = defineModel<string | number>();

  const modelValP = computed({
    get() {
      return String(modelVal.value);
    },
    set(val) {
      modelVal.value = val;
    },
  });

  const dictSelect = useSelectOption({
    initQueryParams: [props.type],
    apiFun: queryStateByCode,
    fieldNames: {
      value: 'stateValue',
      label: 'stateLabel',
    },
  });
</script>

<template>
  <a-select v-bind="dictSelect.bindProps" v-model="modelValP" />
</template>

<style lang="less" scoped></style>
